<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">

	<head>
		<meta charset="UTF-8">
		<title>抽卡模拟</title>
		<link rel="shortcut icon" th:href="@{/static/image/logo/favicon.ico}" type="image/x-icon"/>
		<link th:replace="common/base::static"/>
		<link rel="stylesheet" th:href="@{/static/css/app.css}"/>
	</head>

	<body οnlοad='init()'>
		<div id="app">
			<input type="button" name="normal" value="常驻池" />
			<input type="button" name="limit" value="限定池" /><br />
			<input type="button" name="single" @click="single" value="单抽" />
			<input type="button" name="ten" @click="ten" value="十连" />
			<div id="detail">
				抽奖次数：{{count}} &nbsp; 原石花费：{{count*160}}<br /> 出货率：
				<span><div>3★ -> {{s3_count / count *100}}%</div>
					  		  <div>4★ -> {{s4_count / count *100}}%</div>
					  		  <div>5★ -> {{s5_count / count *100}}%</div></span> 保底次数：4★ -> {{s4_baodi}} 次 &nbsp; 5★ -> {{s5_baodi}} 次<br /> 距离大保底还有：{{da_baodi}} 发<br />
				<span>5★(0.6%)：{{s5_count}} 个</span><br />
				<span>4★(5.1%)：{{s4_count}} 个 </span><br />
				<span>3★(94.3%)：{{s3_count}} 个 </span><br />
			</div>

			<div id="load">
<!--				<div>-->
<!--					<div> 日志： </div>-->
<!--					<div id="container">-->
<!--						<div id="r4_log">-->
<!--							<table width="200px" class="zhi" border="1" cellspacing="0" cellpadding="0" style="text-align: center;">-->
<!--								<tr>-->
<!--									<th colspan="3">4★汇总</th>-->
<!--								</tr>-->
<!--								<tr id="r4_d">-->
<!--									<th>次数</th>-->
<!--									<th>星级</th>-->
<!--									<th>名字</th>-->
<!--								</tr>-->
<!--							</table>-->
<!--						</div>-->
<!--						<div id="log">-->
<!--							<table width="600px" border="1" cellpadding="0" cellspacing="0" style="text-align: center;" id="log_t">-->
<!--								<tr id="sum">-->
<!--									<th>次数</th>-->
<!--									<th>星级</th>-->
<!--									<th>名字</th>-->
<!--									<th>本次随机数</th>-->
<!--								</tr>-->
<!--							</table>-->
<!--						</div>-->
<!--						<div id="r5_log">-->
<!--							<table width="200px" class="jin" border="1" cellspacing="0" cellpadding="0" style="text-align: center;">-->
<!--								<tr>-->
<!--									<th colspan="3">5★汇总</th>-->
<!--								</tr>-->
<!--								<tr id="r5_d">-->
<!--									<th>次数</th>-->
<!--									<th>星级</th>-->
<!--									<th>名字</th>-->
<!--								</tr>-->
<!--							</table>-->
<!--						</div>-->
<!--					</div>-->
<!--				</div>-->
			</div>

		</div>

		<script type="text/javascript"  th:src="@{/static/js/vue.js}"></script>
		<script type="text/javascript" th:src = "@{/static/js/jquery-3.4.1.min.js}"></script>
		<script type="text/javascript" src="js/normal.js" th:src = "@{/static/js/normal.js}"></script>
		<script type="text/javascript">
			// $(function() {

				// $.ajax({
				// 	type: "get",
				// 	url: " http://localhost/sys/cards/getJson",
				// 	dataType: 'json',
				// 	success: function(rs) {
				// 		kachi = rs;
				//
				// 	}
				// });
				 function init() {
						console.log("执行")
						$.ajax({
							type: "get",
							url: " http://localhost/sys/cards/selectType/0",
							success: function(rs) {

								$("#load").html(rs);
							}
						});

				}
				$("input[name=normal]").on('click', function() {
					// $("#load").load("常驻池.html");
					$.ajax({
						type: "get",
						url: " http://localhost/sys/cards/selectType/0",
						success: function(rs) {

							$("#load").html(rs);
						}
					});
				})

				$("input[name=limit]").on('click', function() {
					$.ajax({
						type: "get",
						url: " http://localhost/sys/cards/selectType/1",
						success: function(rs) {

							$("#load").html(rs);
						}
					});
				})

			// })
		</script>

	</body>

</html>